<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>uuQuery - style selector</title>
<style type="text/css">@import url(../README.css);</style>
<script type="text/javascript" src="../uuQuery.js"></script>
<script type="text/javascript" src="iterator.js"></script>
</head>
<body>
<script>
window.onload = function() {
  setTimeout(boot1000, 1000);
};

function boot1000() {
  uuQuery("div{ position: static }").forEach(function(v) {
    v.style.cssText = "margin:0 auto;width:30em;" +
                      "border:1px solid green;text-align:center";
  });
  uuQuery("div{textAlign=center}:nth-child(odd)").forEach(function(v) {
    v.style.border = "1px solid red";
    v.style.textAlign = "right";
  });
}
</script>
<ul>
<li>Computed style operator :</li>
<li>Computed style operator =</li>
</ul>
<p>これら二つのオペレータは同じ結果になります。</p>
<div>align: center; text-align: center</div>
<div>align: center; text-align: right</div>
<pre class="eg">
&lt;div&gt;align: center; text-align: center&lt;/div&gt;
&lt;div&gt;align: center; text-align: right&lt;/div&gt;

<u>// センタリングします。</u>
function boot1000() {
  <u>// 注意: { の前にはスペースを挿入できません。</u>
  <u>// "div { " のように div と { の間にスペースを入れると動作しません。</u>
  uuQuery("div<b>{</b> position<b>:</b> static <b>}</b>").forEach(function(v) {
    v.style.cssText = "margin:0 auto;width:30em;" +
                      "border:1px solid green;text-align:center";
  });
  <u>// {} や operator(=) の前後のスペースは無くてもかまいません。</u>
  uuQuery("div<b>{</b>textAlign<b>=</b>center<b>}</b>:nth-child(odd)").forEach(function(v) {
    v.style.border = "1px solid red";
    v.style.textAlign = "right";
  });
}
</pre>

</body>
</html>